<template>
<view class="content"  v-if="isLoading">
  <view class="loading">
  <image class="page-loading" src="/static/common/loading.gif"></image>
  </view>
</view>
</template>
 
<script>
 
export default {
	
  data() {
    return {
      text: "",
      isLoading: true,
    };
  },
  methods: {
    showLoading(text) {
      this.isLoading = true;
    },
    hideLoading() {
      this.isLoading = false;
    },
  },
};
</script>
 
<style lang="scss" scoped>
	.content{
		position: absolute;
		background: #ffffff;
		height: 100%;
		width: 100%;
		margin-left: -20rpx;
		padding: 0;
		z-index: 1;
	}
	.loading {
	   display: flex;
		 flex-direction:column; /**子view排列方式row--水平 column--垂直*/
		 align-items: center;    /**子view垂直居中*/
		 vertical-align: center; /**垂直居中*/
		 justify-content: center; /**内容居中*/   
	}
	.page-loading{
		margin-top: 60%;
		width: 350rpx;
		height: 220rpx;
	}
</style>